<ion-header>
    <ion-navbar no-border-bottom>
        <ion-title>邮件详情</ion-title>
        <ion-buttons end>
            <button ion-button (click)="chooseListType()">操作</button>
        </ion-buttons>
    </ion-navbar>
</ion-header>
<ion-content class='email-detail'>
    <ion-list class='gfoa-list'>
        <ion-item>
            <ion-row>
                <ion-col width-25 class='title'>发件人:</ion-col>
                <ion-col class='substance'>{{email.refenDtos[0].svalue}}</ion-col>
            </ion-row>
        </ion-item>
        <ion-item>
            <ion-row>
                <ion-col width-25 class='title'>收件人:</ion-col>
                <ion-col class='substance'>
                    <div class="selected-user-list-item" (click)="changeShowList(recieveList)" *ngIf="recieveList.list.length>showListLimit">
                        总共：{{recieveList.list.length}}个
                        <ion-icon name="arrow-forward" *ngIf="!recieveList.isShow"></ion-icon>
                        <ion-icon name="arrow-down" *ngIf="recieveList.isShow"></ion-icon>
                    </div>
                    <div class="selected-user-list-item" *ngFor="let item of recieveList.list;" [hidden]="!recieveList.isShow">{{item}}
                    </div>
                </ion-col>
            </ion-row>
        </ion-item>
        <ion-item *ngIf='otherList.list.length>0'>
            <ion-row>
                <ion-col width-25 class='title'>抄送:</ion-col>
                <ion-col class='substance'>
                    <div class="selected-user-list-item" (click)="changeShowList(otherList)" *ngIf="otherList.list.length>showListLimit">
                        总共：{{otherList.list.length}}个
                        <ion-icon name="arrow-forward" *ngIf="!otherList.isShow"></ion-icon>
                        <ion-icon name="arrow-down" *ngIf="otherList.isShow"></ion-icon>
                    </div>
                    <div class="selected-user-list-item" *ngFor="let item of otherList.list" [hidden]="!otherList.isShow">
                        {{item}}
                    </div>
                </ion-col>
            </ion-row>
        </ion-item>
        <ion-item *ngIf="secretList.list.length>0">
            <ion-row>
                <ion-col width-25 class='title'>密送:</ion-col>
                <ion-col class='substance'>
                    <div class="selected-user-list-item" (click)="changeShowList(secretList)" *ngIf="secretList.list.length>showListLimit">
                        总共：{{secretList.list.length}}个
                        <ion-icon name="arrow-forward" *ngIf="!secretList.isShow"></ion-icon>
                        <ion-icon name="arrow-down" *ngIf="secretList.isShow"></ion-icon>
                    </div>
                    <div class="selected-user-list-item" *ngFor="let item of secretList.list" [hidden]="!secretList.isShow">
                        {{item}}
                    </div>
                </ion-col>
            </ion-row>
        </ion-item>
        <ion-item>
            <ion-row>
                <ion-col width-25 class='title'>主题:</ion-col>
                <ion-col class='substance' [innerHTML]="domTitle"></ion-col>
            </ion-row>
        </ion-item>
        <ion-item *ngIf="email.urgency!==0">
            <ion-row>
                <ion-col width-25 class='title'>重要性:</ion-col>
                <ion-col class='substance'>
                    <span *ngIf="email.urgency==1">重要</span>
                    <span *ngIf="email.urgency==2">一般</span>
                    <span *ngIf="email.urgency==3">缓慢</span>
                    <span *ngIf="email.urgency==9">系统邮件</span>
                </ion-col>
            </ion-row>
        </ion-item>
    </ion-list>
    <ion-list class='gfoa-list' *ngIf="email.attach">
        <ion-item-divider color="light">附件</ion-item-divider>
        <ion-item class='text-content attach-item' *ngFor="let attach of email.attach.split(';');let i=index;" (click)="openFile(attach.split(',')[0],attach.split(',')[1])">
            {{i+1+"："+attach.split(',')[1]}}
        </ion-item>
    </ion-list>
    <ion-list class='gfoa-list'>
        <ion-item-divider color="light">邮件正文</ion-item-divider>
        <ion-item class='text-content' class="html-content" [innerHTML]="domContent" style="padding: 16px;display: block;">
            <!-- <ion-scroll scrollX="true" scrollY="true" class="html-scroll"> -->
            <!-- <div ></div> -->
            <!-- </ion-scroll> -->
        </ion-item>
    </ion-list>
    <ion-row style="margin-bottom: 20px;">
        <ion-col *ngIf="_.indexOf(['IMailInbox'], type)>-1">
            <button ion-button icon-left block color="light" (click)="editEmail('reply')">
                <ion-icon name="undo"></ion-icon>
                回复
            </button>
        </ion-col>
        <ion-col *ngIf="_.indexOf(['IMailInbox','IMOutbox','IMailTask','IMailImp'], type)>-1">
            <button ion-button icon-left block color="light" (click)="editEmail('forward')">
                <ion-icon name="redo"></ion-icon>
                转发
            </button>
        </ion-col>
        <ion-col *ngIf="_.indexOf(['IMailTask','IMailImp'], type)>-1">
            <button ion-button icon-left block color="light" (click)="deleteEmail()">
                <ion-icon name="trash"></ion-icon>
                删除
            </button>
        </ion-col>
        <ion-col *ngIf="_.indexOf(['IMOutbox','WasteBox','IMailHIS'], type)>-1">
            <button ion-button icon-left block color="light" (click)="deleteEmail(true)">
                <ion-icon name="trash"></ion-icon>
                永久删除
            </button>
        </ion-col>
        <ion-col *ngIf="_.indexOf(['WasteBox'], type)>-1">
            <button ion-button icon-left block color="light" (click)="moveBackToInbox()">
                <ion-icon name="albums"></ion-icon>
                移至收件箱
            </button>
        </ion-col>
        <ion-col *ngIf="_.indexOf(['IMailHIS'], type)>-1">
            <button ion-button icon-left block color="light" (click)="HisMailToInbox()">
                <ion-icon name="return-left"></ion-icon>
                恢复
            </button>
        </ion-col>
    </ion-row>
</ion-content>
